<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>打卡记录</title>
<link rel="stylesheet" href="/Public/res/layui/css/layui.css">
<style>
.layui-form-label{width:auto}
</style>
</head>
<body>
	<input type="hidden" id="sid" value="{$_GET['sid']}">
	<input type="hidden" id="cid" value="{$_GET['cid']}">
	<form class="delform layui-form" method="post" style="margin-top:20px">
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">显示条数</label>
				<div class="layui-input-inline" style="width:70px">
					<select id="row" name="row" lay-filter="rowcount" lay-search="">
						<option value="10">10</option>
						<option value="20">20</option>
						<option value="30">30</option>
						<option value="50">50</option>
						<option value="100">100</option>
					</select>
				</div>
			</div>
			<div class="layui-inline">
				<label class="layui-form-label">选择日期</label>
				<div class="layui-input-inline" style="width:100px">
					<select id="year" name="year" lay-filter="year" lay-search="">
						<option value="">选择年份</option>
						<option value="2015">2015</option>
						<option value="2016">2016</option>
						<option value="2017">2017</option>
					</select>
				</div>
				<div class="layui-input-inline" style="width:100px">
					<select id="month" name="month" lay-filter="month" lay-search="">
						<option value="">选择月份</option>
						<option value="1">1</option>
						<option value="2">2</option>
						<option value="3">3</option>
						<option value="4">4</option>
						<option value="5">5</option>
						<option value="6">6</option>
						<option value="7">7</option>
						<option value="8">8</option>
						<option value="9">9</option>
						<option value="10">10</option>
						<option value="11">11</option>
						<option value="12">12</option>
					</select>
				</div>
			</div>
			<!-- <div class="layui-inline">
				<label class="layui-form-label">选择班级</label>
				<div class="layui-input-inline" style="width:100px">
					<select id="classlist" name="class" lay-filter="classlist" lay-search="">
						
					</select>
				</div>
				<a class="layui-btn" href="javascript:;" id="lxd-sub">查询</a>
			</div> -->
			<a class="layui-btn" style="float:right;margin-right:20px" href="javascript:;" id="export" >导出EXCEL</a>
		</div>
        <div class="layui-form lxd-datashow" data-url="/Miniweb/Test/get_taback" data-condition="year={$_GET['year']}&month={$_GET['month']}" data-p="1" data-row="10">
			<table class="layui-table" id="export-table">
				<thead>
				<tr>
					<th>卡号</th>
					<th>姓名</th>
					<th>联系人手机1</th>
					<th>刷卡时间</th>
				</tr>
				</thead>
				<tbody class="data"></tbody>
			</table>
		  <div class="page" style="text-align:center"></div>
		  
          
          <script class="data-tpl" type="text/html">
            {{# layui.each(d, function(index, item){ }}
              <tr>
                <td>{{item.card}}</td>
                <td>{{item.realname || "无"}}</td>
                <td>{{item.mobile1 || "无"}}</td>
                <td>{{item.dateline}}</td>
              </tr>
            {{# }); }} {{# if(d.length === 0){ }} --- No Data --- {{# } }}
		  </script>
		  
        </div>
	</form>
<script src="/Public/res/layui/layui.js"></script>
<script>
	layui.cache.page = 'user';
	layui.cache.user = {
		username: '游客'
		,uid: -1
		,avatar: '../../res/images/avatar/00.jpg'
		,experience: 83
		,sex: '男'
	};
	layui.config({
		version: "2.0.1"
		,base: '/Public/res/mods/'
		,debug: true
	}).extend({
		fly: 'index'
	}).use('fly');

	layui.use(['layer', 'jquery', 'laypage', 'laytpl', 'form'], function() {
		var $ = layui.jquery,
        layer = layui.layer,
        laytpl = layui.laytpl,
        laypage = layui.laypage,
        form = layui.form;
	
		var sid = $('#sid').val();
		var cid = $('#cid').val();
		$('#lxd-sub').click(function(){
			loadData('click');
		});


		var $datashow = $('.lxd-datashow');
		var dataTpl = $datashow.find('script.data-tpl').html();
		var $pageDom = $datashow.find('.page');
		var $dataDom = $datashow.find('.data');
		//监听条数下拉框
		form.on('select(rowcount)', function(data){
			$datashow.attr('data-row',data.value);
			loadData();
		});
		// getClass();
		// //获取班级数据
		// function getClass(){
		// 	$.post('/Export/Index/get_class',{"sid":sid},function(ret){
				
		// 			if(!ret.data){
		// 				ret = eval( '(' + ret + ')' );
		// 			}
		// 		if(ret.status == 1){
		// 			var html = '<option value="">非必选</option>';
		// 			for(var key in ret.data){
		// 				var v = ret.data[key];
		// 				html += '<option value="'+key+'">'+v+'</option>';
		// 			}
		// 			$('#classlist').append(html);
		// 			// form.render('select','classlist');
		// 			form.render();
		// 		}
				
		// 	});
		// }

		function loadData(lxdType){
			if(lxdType == 'export'){
				$datashow.attr('data-p','1');
				$datashow.attr('data-row','9999999999');
			}else{
				if(lxdType == 'click'){
					$datashow.attr('data-p','1');
				}
				$datashow.attr('data-row',$('#row').val());
			}
			
			var year = $('#year').val();
			var month = $('#month').val();
			var p = $datashow.attr('data-p');
			var row = $datashow.attr('data-row');
			
			var myCondition = "p=" + p + "&row=" + row + "&year=" + year + "&month=" + month + "&sid=" + sid;
			if(cid){
				myCondition += "&cid=" + cid;
			}
			$.get('/Export/Index/get_taback?'+myCondition,function(res){
				if(!res.data){
					res = eval( '(' + res + ')' );
				}
				if (res.status == 1) {
						if(res.data.data){
							//开始渲染数据
							laytpl(dataTpl).render(res.data.data, function(html) {
								$dataDom.html(html);
								
								form.render(); //重新渲染表单
							});
						
						
							//载入分页
							if ($pageDom.length != 0) {
								laypage.render({
									elem: $pageDom,
									count: res.data.page.total,
									first: 1,
									last: Math.ceil(res.data.page.total / res.data.page.row),
									curr: res.data.page.cur,
									prev: '上一页',
									next: '下一页',
									layout:['prev', 'page', 'next', 'skip'],
									jump: function(obj) {
										//处理跳转，回调自己（递归）
										//alert(obj.curr);
										if (obj.curr != p) {
											p = obj.curr;
											//当前页发生改变的时候执行一下改变
											$datashow.attr('data-p', p);
											$datashow.attr('data-row', row);
											loadData();
										}

									}
								});
							}
							if(lxdType == 'export'){
								$('.page').html('');
								method5('export-table');
							}
						}else{
							$dataDom.html('&nbsp;&nbsp;&nbsp;&nbsp;暂无数据');
						}

					} else {
						layer.msg(res.info, { icon: 2, time: 1000 });
					}
			});
			
		}

		$('#export').click(function(){
			loadData('export');
			
		});	

	});
	function timecheck(d){
		if (typeof (d) == "string") d = new Date(d * 1000);
		var ultZeroize = function (v, l) {
			var z = "";
			l = l || 2;
			v = String(v);
			for (var i = 0; i < l - v.length; i++) {
				z += "0";
			}
			return z + v;
		};
		return (d.getFullYear() + "-" + ultZeroize(d.getMonth() + 1) + "-" + ultZeroize(d.getDate()) + " " + ultZeroize(d.getHours()) + ":" + ultZeroize(d.getMinutes()) + ":" + ultZeroize(d.getSeconds()));
	}

		
		var idTmr;  
        function  getExplorer() {  
            var explorer = window.navigator.userAgent ;  
            //ie  
            if (explorer.indexOf("MSIE") >= 0) {  
                return 'ie';  
            }  
            //firefox  
            else if (explorer.indexOf("Firefox") >= 0) {  
                return 'Firefox';  
            }  
            //Chrome  
            else if(explorer.indexOf("Chrome") >= 0){  
                return 'Chrome';  
            }  
            //Opera  
            else if(explorer.indexOf("Opera") >= 0){  
                return 'Opera';  
            }  
            //Safari  
            else if(explorer.indexOf("Safari") >= 0){  
                return 'Safari';  
            }  
        }  
        function method5(tableid) {  
            if(getExplorer()=='ie')  
            {  
                var curTbl = document.getElementById(tableid);  
                var oXL = new ActiveXObject("Excel.Application");  
                var oWB = oXL.Workbooks.Add();  
                var xlsheet = oWB.Worksheets(1);  
                var sel = document.body.createTextRange();  
                sel.moveToElementText(curTbl);  
                sel.select();  
                sel.execCommand("Copy");  
                xlsheet.Paste();  
                oXL.Visible = true;  
  
                try {  
                    var fname = oXL.Application.GetSaveAsFilename("Excel.xls", "Excel Spreadsheets (*.xls), *.xls");  
                } catch (e) {  
                    print("Nested catch caught " + e);  
                } finally {  
                    oWB.SaveAs(fname);  
                    oWB.Close(savechanges = false);  
                    oXL.Quit();  
                    oXL = null;  
                    idTmr = window.setInterval("Cleanup();", 1);  
                }  
  
            }  
            else  
            {  
                tableToExcel(tableid)  
            }  
        }  
        function Cleanup() {  
            window.clearInterval(idTmr);  
            CollectGarbage();  
        }  
        var tableToExcel = (function() {  
            var uri = 'data:application/vnd.ms-excel;base64,',  
                    template = '<html><head><meta charset="UTF-8"></head><body><table>{table}</table></body></html>',  
                    base64 = function(s) { return window.btoa(unescape(encodeURIComponent(s))) },  
                    format = function(s, c) {  
                        return s.replace(/{(\w+)}/g,  
                                function(m, p) { return c[p]; }) }  
            return function(table, name) {  
                if (!table.nodeType) table = document.getElementById(table)  
                var ctx = {worksheet: name || 'Worksheet', table: table.innerHTML}  
                window.location.href = uri + base64(format(template, ctx))  
            }  
        })() 
	

</script>

</body>
</html>